//初始化地图对象，加载地图
var map = new AMap.Map("container", {
    center: [117.656746034782,
        28.266660937627716],//地图中心点
    zoom: 10 //地图显示的缩放级别
});

var district = null;
var polygon;
var currentTextMarker = null;

function drawBounds() {
    //加载行政区划插件
    if (!district) {
        //实例化DistrictSearch
        var opts = {
            subdistrict: 4,   //获取边界不需要返回下级行政区 1：返回下一级行政区信息。
            extensions: 'all',  //返回行政区边界坐标组等具体信息
            level: 'district'  //查询行政级别为 市
        };
        district = new AMap.DistrictSearch(opts);
    }
    //行政区查询
    district.setLevel(document.getElementById('level').value)
    console.log("行政区查询-level:", document.getElementById('level').value)
    var keyword = document.getElementById('district').value;
    console.log("行政区查询-keyword:", document.getElementById('district').value)
    if (keyword === '') {
        log.warn('名称不能为空');
        return
    }
    //根据行政区名称查询行政区信息
    district.search(document.getElementById('district').value, function (status, result) {
        //清除上次查询结果的polygon
        if (polygon) {
            map.remove(polygon);
            polygon = null;
        }
        if (currentTextMarker) {
            map.remove(currentTextMarker);
            currentTextMarker = null;
        }
        //检查查询结果是否有效
        if (!result || !result.districtList || !result.districtList[0]) {
            log.warn('请正确填写名称或更新其他名称');
            return;
        }
        //打印查询结果
        console.log("行政区查询-result:", result);
        var bounds = result.districtList[0].boundaries;
        console.log("bounds:", bounds);

        // 构造要发送的数据对象
        var dataToSend = {
            [keyword]: bounds
        };

        // 发送 bounds 到服务器
        fetch('http://localhost:3000/save-bounds', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json'
            },
            body: JSON.stringify(dataToSend)
        })
            .then(response => response.text())
            .then(data => {
                console.log('Success:', data);
            })
            .catch((error) => {
                console.error('Error:', error);
            });

        //如果查询到边界信息，则生成polygon
        if (bounds) {
            //生成行政区划polygon
            for (var i = 0; i < bounds.length; i += 1) {
                bounds[i] = [bounds[i]];
            }
            //创建并添加polygon到地图
            polygon = new AMap.Polygon({
                strokeWeight: 1,      // 设置多边形边框的宽度为 1 像素
                path: bounds,         // 设置多边形的路径（边界坐标数组）
                fillOpacity: 0.8,     // 设置多边形填充颜色的透明度为 0.8
                fillColor: '#ff80a2', // 设置多边形的填充颜色为浅粉红色
                strokeColor: '#0091ea' // 设置多边形边框的颜色为蓝色
            });

            console.log("边界polygon", polygon)
            map.add(polygon);

            // 获取多边形的中心点
            // var center = polygon.getCenter();
            var center = calculatePolygonCenter(bounds[0]);
            // var center = [  116.603686, 40.05295]
            console.log("中心点", center)
            // 创建文本标记
            currentTextMarker = new AMap.Text({
                position: center,       // 文本标记的位置为中心点
                text: keyword,        // 文本内容
                offset: new AMap.Pixel(0, 0), // 文本标记的偏移量
                style: {
                    fontSize: '32px',   // 字体大小
                    color: '#e80a0a',      // 字体颜色
                    backgroundColor: 'rgba(255, 255, 255, 0.8)', // 背景颜色
                    padding: '5px',     // 内边距
                    border: '1px solid #ccc' // 边框样式
                }
            });

            // 将文本标记添加到地图
            map.add(currentTextMarker);

            map.setFitView(polygon);//视口自适应
        }
    });
}

function parseCoordinateString(coordinateString) {
    // 将字符串解析为数组
    var parts = coordinateString.split(',');
    return [parseFloat(parts[0]), parseFloat(parts[1])];
}

function calculatePolygonCenter(path) {
    if (path.length === 0) {
        console.error('Path is empty, cannot calculate center.');
        return [0, 0]; // 返回一个默认值，防止 NaN
    }

    var x = 0;
    var y = 0;
    var len = path.length;
    for (var i = 0; i < len; i++) {
        y += path[i][0];
        var result = parseCoordinateString(y)

    }

    return result;
}

function processDistrictList(districtList) {
    console.log('districtList:', districtList); // 调试输出 districtList 的值
    console.log('Type of districtList:', typeof districtList); // 调试输出 districtList 的类型

    if (Array.isArray(districtList)) { // 检查 districtList 是否为数组
        districtList.forEach(function (keyword) {
            drawBounds(keyword);
        });
    } else {
        console.error('districtList is not an array:', districtList);
    }
}

// 示例调用
// 定义要查询的行政区名称列表
var districtList = ["东城区", "西城区"];

// 调用 processDistrictList 函数处理行政区列表
processDistrictList(districtList);

// 为按钮添加点击事件监听器，当点击按钮时调用 drawBounds 函数
// document.getElementById('json').onclick = processDistrictList;

document.getElementById('json').onclick = function () {
    // 获取输入框中的值并转换为数组
    var inputDistricts = document.getElementById('district').value.trim().split(',').map(function (item) {
        return item.trim();
    }).filter(function (item) {
        return item.length > 0;
    });

    // 调用 processDistrictList 处理输入的行政区列表
    processDistrictList(inputDistricts);
};


drawBounds();
// 为按钮添加点击事件监听器，当点击按钮时调用 drawBounds 函数
document.getElementById('draw').onclick = drawBounds;
// 为输入框添加键盘事件监听器，当按下回车键时调用 drawBounds 函数
document.getElementById('district').onkeydown = function (e) {
    if (e.keyCode === 13) {
        drawBounds();
        return false;
    }
    return true;
};
  